//打包规则
// 导入
const gulp = require('gulp')
//导入第三方压缩css文件的插件
const cssmin = require('gulp-cssmin')
//自动添加前缀,也需要一个第三方
const autoprefixer = require('gulp-autoprefixer')
//导入gulp-sass和sass
const sass = require('gulp-sass')(require('sass'))
//下载导入gulp-uglify
const uglify = require('gulp-uglify')
//下载导入gulp-file-include
const include= require('gulp-file-include')
//下载gulp-htmlmin
const htmlmin= require('gulp-htmlmin')
//下载导入gulp-imagemin
// const imagemin = require('gulp-imagemin')
//综合删除 del
const del= require('del')
//边打包边开发
const webserver = require('gulp-webserver')


//css打包
const cssHandler = ()=>{
    return gulp
    .src('./src/css/*.css')
    //下面这两个是压缩文件的
    .pipe(autoprefixer())
    .pipe(cssmin())
    .pipe(gulp.dest('./dist/css/'))
}
//sass打包 他依赖两个包
function sassHandler() {
    return gulp
    .src('./src/scss/*.scss')//找到文件
    .pipe(sass())//调用引入的第三方插件
    //下面这两个是压缩文件的
    .pipe(autoprefixer())
    .pipe(cssmin())
    .pipe(gulp.dest('./dist/scss/'))//转换之后保存到的目录
}
//js打包
function jsHandler() {
    return gulp
    .src('./src/js/*.js')//找到文件
    .pipe(uglify())
    .pipe(gulp.dest('./dist/js/'))//转换之后保存到的目录
}
//html打包
function htmlHandler() {
    return gulp
    .src('./src/views/*.html')//找到文件
    .pipe(include({
        basepath:'./src/components/',//存放组件的位置
        prefix:'@-@'
    }))
    .pipe(htmlmin({//压缩
        removeComments: true, // 是否移除注释
        removeEmptyAttributes: true, //是否移除空属性
        removeAttributeQuotes: true,  //是否移除属性值的双引号
        collapseWhitespace: true, //是否移除空格和换行
        // collapseBooleanAttributes: true, //是否简化属性值为布尔的属性
        // removeScriptTypeAttributes: true, // 是否移除 script 标签的默认 type 属性
        // removeStyleLinkTypeAttributes: true, // 是否移除 link 和 style 标签的默认 type 属性
        // minifyCSS: true, //是否压缩页面中给的 style 标签（内嵌式 `css` 代码）
        // minifyJS: true, // 是否压缩页面的的 `script` 标签（内嵌式 `js` 代码）
    }))
    .pipe(gulp.dest('./dist/views/'))//转换之后保存到的目录
}
//img打包
function imgHandler() {
    return gulp
    .src('./src/images/**.*')//找到文件

    .pipe(gulp.dest('./dist/images/'))//转换之后保存到的目录
}
// audio打包
function audioHandler() {
    return gulp
        .src('./src/audios/**.*')
        .pipe(gulp.dest('./dist/audios'))
}
// 打包data
function dataHandler() {
    return gulp
        .src('./src/data/**.*')
        .pipe(gulp.dest('./dist/data'))
}
// 打包fonts
function fontsHandler() {
    return gulp
        .src('./src/fonts/**.*')
        .pipe(gulp.dest('./dist/fonts'))
}
// 打包libs
function libsHandler() {
    return gulp
        .src('./src/libs/**.*')
        .pipe(gulp.dest('./dist/libs'))
}
// 打包videos
function videosHandler() {
    return gulp
        .src('./src/videos/**.*')
        .pipe(gulp.dest('./dist/videos'))
}
//热更新
function webserverHandler() {
    return gulp
    .src('./dist')
    .pipe(webserver({
        host:'localhost',
        port:8080,
        open:'./views/index.html',
        livereload: true
    }))
}
// function watchHandler() {
//     // 这里不需要返回出去
//     gulp.watch('./src/views/*.html', htmlHandler)
//     gulp.watch('./src/js/*.js', jsHandler)
//     gulp.watch('./src/css/*.css', cssHandler)
// }

//需要一个监听
function watchHandler() {
    gulp.watch('./src/views/*.html',htmlHandler)
    gulp.watch('./src/js/*.js', jsHandler)
    gulp.watch('./src/css/*.css', cssHandler)
}
//综合打包
let _default = gulp.parallel(cssHandler,sassHandler,jsHandler,htmlHandler,imgHandler,audioHandler, dataHandler,
fontsHandler,libsHandler,videosHandler,)
// //综合删除
// function delHandler() {
//     return del(['./dist/'])
// }
//添加了删除任务后的综合打包
// let _default = gulp.series(
//     delHandler,
//     gulp.parallel(cssHandler,sassHandler,jsHandler,htmlHandler,imgHandler,audioHandler, dataHandler, fontsHandler,libsHandler,videosHandler,),
//     webserverHandler,
//     watchHandler,
//     )







//导出
module.exports={
    cssHandler,
    sassHandler,
    jsHandler,
    htmlHandler,
    imgHandler,
    audioHandler,
    dataHandler,
    fontsHandler,
    libsHandler,
    videosHandler,
    webserverHandler,
    default:_default 
}